<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>关于鼠标在页面中坐标显示的种种</title>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<script type="text/javascript">
			function mouseCoordination(michael) {
				//以下主要是对不同浏览器进行兼容操作
				if (michael.pageX || michael.pageY) {
					//IE不支持pageX之类的 这里主要是对于chrome 和firefox之类的浏览器
					return {
						x : michael.pageX,
						y : michael.pageY
					};
				} else
					return {
						//以下是IE浏览器的操作动作 至于为什么这么写 待会看图就会明白
						x : michael.clientX + document.body.scrollLeft
								- document.body.clientLeft,
						y : michael.clientY + document.body.scrollTop
								- document.body.clientTop
					};
		
			}
		
			function mouseMove(michael) {
				michael = michael || window.event; //不知为什么 显示出来 就是多了个michael 应该前面变量只有一个michael的
				var mouseCoo = mouseCoordination(michael);
				document.getElementById('xCoordination').value = mouseCoo.x;
				document.getElementById('yCoordination').value = mouseCoo.y;
			}
			document.onmousemove = mouseMove;
		</script>
	</head>
	<body>
		<h1>关于鼠标在页面中坐标显示的种种：<a href="http://www.iteye.com/topic/775445">参考地址</a></h1>
		X坐标：<input id="xCoordination" type="text" />
		Y坐标：<input id="yCoordination" type="text" />
	</body>
</html>